// components/addCart/addCart.js
var app = getApp()
import {
  count
} from '../../../../../api/cart'

Component({
  /**
   * 组件的属性列表
   */
  properties: {
    cartX: {
      type: String,
      value: 13
    },
    cartY: {
      type: String,
      value: 95
    },
    price: {
      type: Number,
      value: 0
    },
    quantity: {
      type: Number,
      value: 0
    },
    miniPrice: {
      type: Number,
      value: 0
    },
    buildPrice: {
      type: String,
      value: 0
    },
    paused: {
      type: Boolean,
      value: false
    },
  },

  /**
   * 组件的初始数据
   */
  data: {
    hideCount: true, //角标初始是隐藏的
    count: 0, //角标数
    amount: 0,
    buildAmount: 0,
    hide_good_box: true,
    feiBox: "",
    bus_x: "",
    bus_y: "",
    time: null,
    minimumDelivery: 0,
    shopId: app.globalData.shopId
  },

  observers: {
    'price'(newVal) {
      this.data.amount = newVal.toFixed(2)
      this.setData({
        amount: newVal
      })
    },
    'quantity'(newVal) {
      this.data.count = newVal
      this.setData({
        count: newVal
      })
    },
    'miniPrice'(newVal) {
      this.data.minimumDelivery = newVal
      this.setData({
        minimumDelivery: newVal
      })
    },
    'buildPrice'(newVal) {
      console.log(newVal);
      this.data.buildAmount = newVal
      this.setData({
        buildAmount: this.data.buildAmount
      })
    },
  },

  lifetimes: {
    attached: function () {
      // 在组件实例进入页面节点树时执行
      this.getCartCount()
    },
    detached: function () {
      // 在组件实例被从页面节点树移除时执行
    },
  },
  /**
   * 组件的方法列表
   */
  methods: {
    //点击跳转购物车
    toCart() {
      wx.switchTab({
        url: '/pages/goods/shoppingCart/shoppingCart',
      })
    },

    openCart() {
      this.triggerEvent('openCartFrame')
    },

    //获取购物车的数量信息
    getCartCount() {
      count({
        uuid: app.globalData.uuid,
        // shopId: app.globalData.shopId
      }).then(res => {
        if (res.type == 'success') {
          this.setData({
            count: res.data.quantity,
            amount: res.data.amount
          })
        }
      }).catch(error => {
      })
    },

    productSumbit() {
      this.triggerEvent('productSumbit')
    },

    //点击商品触发的事件
    touchOnGoods: function (e) {
      //把点击每一项的对应的商品图保存下来，就是飞向购物车的图片
      // this.setData({
      //         feiBox: this.data.imgUrls[e.currentTarget.dataset.idx]
      // })
      // 如果good_box正在运动
      this.busPos = {};
      this.busPos['x'] = app.globalData.ww * parseInt(this.data.cartX) * 0.01; //目标位置的x坐标
      this.busPos['y'] = app.globalData.hh * parseInt(this.data.cartY) * 0.01; //目标位置的y坐标
      if (!this.data.hide_good_box) return;
      //当前点击位置的x，y坐标
      this.finger = {};
      var topPoint = {};
      this.finger['x'] = e.touches["0"].clientX;
      this.finger['y'] = e.touches["0"].clientY - 20;

      if (this.finger['y'] < this.busPos['y']) {
        topPoint['y'] = this.finger['y'] - 150;
      } else {
        topPoint['y'] = this.busPos['y'] - 150;
      }

      if (this.finger['x'] < this.busPos['x']) {
        topPoint['x'] = Math.abs(this.finger['x'] - this.busPos['x']) / 2 + this.finger['x'];
        this.linePos = this.bezier([this.finger, topPoint, this.busPos], 60);
        this.startAnimationLeft();
      } else {
        topPoint['x'] = Math.abs(this.finger['x'] - this.busPos['x']) / 2 + this.busPos['x'];
        this.linePos = this.bezier([this.busPos, topPoint, this.finger], 60);
        this.startAnimationRight();
      }

    },

    //从左开始动画
    startAnimationLeft: function () {
      var index = 0,
        that = this,
        bezier_points = that.linePos['bezier_points'];
      this.setData({
        hide_good_box: false,
        bus_x: that.finger['x'],
        bus_y: that.finger['y']
      })
      this.timer = setInterval(function () {
        index++;
        that.setData({
          bus_x: bezier_points[index]['x'],
          bus_y: bezier_points[index]['y']
        })
        if (index >= 29) {
          clearInterval(that.timer);
          this.getCartCount()
          that.setData({
            hide_good_box: true,
          })
        }
      }, 20);
    },

    //从右开始动画
    startAnimationRight: function () {
      var index = 0,
        that = this,
        bezier_points = that.linePos['bezier_points'];
      var len = bezier_points.length;
      this.setData({
        hide_good_box: false,
        bus_x: that.busPos['x'],
        bus_y: that.busPos['y']
      })
      this.timer = setInterval(function () {
        index++;
        that.setData({
          bus_x: bezier_points[len - index]['x'],
          bus_y: bezier_points[len - index]['y']
        })
        if (index >= 59) {
          clearInterval(that.timer);
          that.getCartCount()
          that.setData({
            hide_good_box: true,
          })
        }
      }, 20);
    },

    //用于添加购物车的动画效果
    bezier: function (points, times) {
      // 0、以3个控制点为例，点A,B,C,AB上设置点D,BC上设置点E,DE连线上设置点F,则最终的贝塞尔曲线是点F的坐标轨迹。
      // 1、计算相邻控制点间距。
      // 2、根据完成时间,计算每次执行时D在AB方向上移动的距离，E在BC方向上移动的距离。
      // 3、时间每递增100ms，则D,E在指定方向上发生位移, F在DE上的位移则可通过AD/AB = DF/DE得出。
      // 4、根据DE的正余弦值和DE的值计算出F的坐标。
      // 邻控制AB点间距
      var bezier_points = [];
      var points_D = [];
      var points_E = [];
      const DIST_AB = Math.sqrt(Math.pow(points[1]['x'] - points[0]['x'], 2) + Math.pow(points[1]['y'] - points[0]['y'], 2));
      // 邻控制BC点间距
      const DIST_BC = Math.sqrt(Math.pow(points[2]['x'] - points[1]['x'], 2) + Math.pow(points[2]['y'] - points[1]['y'], 2));
      // D每次在AB方向上移动的距离
      const EACH_MOVE_AD = DIST_AB / times;
      // E每次在BC方向上移动的距离
      const EACH_MOVE_BE = DIST_BC / times;
      // 点AB的正切
      const TAN_AB = (points[1]['y'] - points[0]['y']) / (points[1]['x'] - points[0]['x']);
      // 点BC的正切
      const TAN_BC = (points[2]['y'] - points[1]['y']) / (points[2]['x'] - points[1]['x']);
      // 点AB的弧度值
      const RADIUS_AB = Math.atan(TAN_AB);
      // 点BC的弧度值
      const RADIUS_BC = Math.atan(TAN_BC);
      // 每次执行
      for (var i = 1; i <= times; i++) {
        // AD的距离
        var dist_AD = EACH_MOVE_AD * i;
        // BE的距离
        var dist_BE = EACH_MOVE_BE * i;
        // D点的坐标
        var point_D = {};
        point_D['x'] = dist_AD * Math.cos(RADIUS_AB) + points[0]['x'];
        point_D['y'] = dist_AD * Math.sin(RADIUS_AB) + points[0]['y'];
        points_D.push(point_D);
        // E点的坐标
        var point_E = {};
        point_E['x'] = dist_BE * Math.cos(RADIUS_BC) + points[1]['x'];
        point_E['y'] = dist_BE * Math.sin(RADIUS_BC) + points[1]['y'];
        points_E.push(point_E);
        // 此时线段DE的正切值
        var tan_DE = (point_E['y'] - point_D['y']) / (point_E['x'] - point_D['x']);
        // tan_DE的弧度值
        var radius_DE = Math.atan(tan_DE);
        // 地市DE的间距
        var dist_DE = Math.sqrt(Math.pow((point_E['x'] - point_D['x']), 2) + Math.pow((point_E['y'] - point_D['y']), 2));
        // 此时DF的距离
        var dist_DF = (dist_AD / DIST_AB) * dist_DE;
        // 此时DF点的坐标
        var point_F = {};
        point_F['x'] = dist_DF * Math.cos(radius_DE) + point_D['x'];
        point_F['y'] = dist_DF * Math.sin(radius_DE) + point_D['y'];
        bezier_points.push(point_F);
      }
      return {
        'bezier_points': bezier_points
      };
    },
  }
})